<template>
  <div class="all" v-loading="loading">
    <div class="allhead">
      <span>{{ paperdata.autoName }}</span>
    </div>
    <div class="totalhead">
      <div style="margin-right: 30px">难度：{{ paperdata.autoDifficulty }}</div>
      <!-- <div>试卷时长：{{ paperdata.duration }}</div> -->
    </div>
    <div class="ftable">
      <div class="table">
        <div>
          <div class="table-top">题目</div>
          <div class="table-bottom">分值</div>
        </div>
        <div
          v-for="(table, tableindex) in paperdata.structureList"
          :key="tableindex"
        >
          <div class="table-top">{{ tableindex + 1 }}</div>
          <div class="table-bottom">{{ table.score }}</div>
        </div>
        <div>
          <div class="table-top-end">总分</div>
          <div class="table-bottom-end">{{ paperdata.autoScore }}</div>
        </div>
      </div>
    </div>

    <div style="margin-top: 20px"  v-for="(mydata,t) in paperdata.structureList" :key="t">
      <div class="topic">
        <div
          style="
            text-align: center;
            width: 100px;
            margin: 2px;
            border: 2px solid #dcdfe6;
          "
         
        >

          第{{t+1}}大题
        </div>
      </div>
      <el-table :data="mydata.structureList" style="width: 100%; margin-top: 10px">
        <el-table-column
          type="index"
          label="顺序"
          :index="indexMethod"
          width="180"
        ></el-table-column>
        <el-table-column prop="questionScore" label="分值"></el-table-column>
        <el-table-column
          prop="chapterId"
          label="所属章节"
          width="180"
        ></el-table-column>
        <el-table-column
          prop="knowledgeA"
          label="一级知识点"
          width="180"
        ></el-table-column>
        <el-table-column prop="knowledgeB" label="二级知识点"></el-table-column>
        <el-table-column
          prop="investigateKnow"
          label="考察知识点"
        ></el-table-column>
        <el-table-column prop="difficulty" label="难度"></el-table-column>
        <el-table-column prop="categorization" label="知识分类"></el-table-column>
      </el-table>
    </div>

    <!-- </div>
      <div v-for="(paperitem,total) in paperdata.structureList" :key="total">
     <div class="paperitemhead">
       <span>{{paperitem.name}}（{{paperitem.score}}分）</span>
     </div>
        <div class="box" v-for="(tabledata,i) in paperitem.container" :key="i">
      <div class="oneselect-cotainer" v-if="tabledata.type=='单选题'||tabledata.type=='单项选择题'">
        <div class="oneselect-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">单选</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="oneselect-body" v-for="(item,i2) in tabledata.options" :key="i2">
          <i
            :class="item.keyTrue ? 'el-icon-success' : 'el-icon-error'"
            :style="{color:item.keyTrue ? '#67c23a' : 'red'}"
          ></i>
          <span>{{String.fromCharCode(i2+65)}}</span>
          .{{item.context}}
        </div>
        <div v-for="(item2,i2) in tabledata.options" :key="'info-'+i2">
          <div class="oneselect-floote-answer" v-if="item2.keyTrue">
            答案：
            <span>{{String.fromCharCode(i2+65)}}</span>
            .{{item2.context}}
          </div>
        </div>
        <div class="oneselect-floote">
          小题讲解：
          <span class="answer">{{tabledata.explains}}</span>
        </div>
      </div>

      <div class="more-cotainer" v-if="tabledata.type=='多选题'||tabledata.type=='多项选择题'">
        <div class="more-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">多选</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="more-body" v-for="(item,i2) in tabledata.options" :key="i2">
          <i
            :class="item.keyTrue ? 'el-icon-success' : 'el-icon-error'"
            :style="{color:item.keyTrue ? '#67c23a' : 'red'}"
          ></i>
          {{String.fromCharCode(i2+65)}}
          .{{item.context}}
        </div>
        <div class="more-floote">
          <span class="more-floote-answer">答案：{{tabledata.answer}}</span>
        </div>
        <div class="more-floote">
          <span class="answer">小题讲解：{{tabledata.explains}}</span>
        </div>
      </div>

      <div class="bank-cotainer" v-if="tabledata.type=='填空题'">
        <div class="bank-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">填空</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
        </div>
        <div class="bank-floote">
          <div class="bank-floote-answeritem">
            <div>
              <span>答案：</span>
            </div>
            <div class="bank-floote-answeritem-body">
              <span class="bank-floote-answer" v-for="(item,i) in tabledata.options" :key="i">
                {{item.answer}}
                <span>({{item.fraction}}分)</span>
              </span>
            </div>
          </div>
          <div>
            <span class="bank-floote-explains">小题讲解：{{tabledata.explains}}</span>
          </div>
        </div>
      </div>

      <div class="oneselect-cotainer" v-if="tabledata.type=='判断题'">
        <div class="oneselect-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">判断</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="judge-chose">
          <div class="judge-chose-item">
            <i
              :class="tabledata.answer=='true'  ? 'el-icon-success' : ''"
              :style="{color:tabledata.answer=='true' ? '#67c23a' : ''}"
            ></i>正确
          </div>
          <div class="judge-chose-item">
            <i
              :class="tabledata.answer!='true'  ? 'el-icon-success' : ''"
              :style="{color:tabledata.answer!='true'  ? '#67c23a' : ''}"
            ></i>错误
          </div>
        </div>
        <div class="judge-floote-answeritem">
          答案：
          <span>{{tabledata.answer=='true' ? '正确' : '错误'}}</span>
        </div>
        <div class="judge-floote">
          小题讲解：
          <span class="answer">{{tabledata.explains}}</span>
        </div>
      </div>

      <div class="brief-cotainer" v-if="tabledata.type=='简答题'">
        <div class="more-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">简答</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="brief-item">
          <el-image
            v-for="(item,index) in tabledata.imgList"
            :key="index"
            class="brief-img-detail"
            :src="item"
            :preview-src-list="tabledata.imgList"
          >></el-image>
        </div>
        <div class="brief-file">
          <div class="brief-file-down" v-for="(item,index) in tabledata.fileList" :key="index">
            <span>文件{{index+1}}</span>
            <el-link target="_blank" :href="item.url" :underline="false" style="margin-left:15px">
              <el-button size="mini" type="warning">点击下载</el-button>
            </el-link>
          </div>
        </div>
        <div class="brief-body">
          <span>答案：{{tabledata.answer}}</span>
        </div>
        <div class="brief-floote">
          <span>小题讲解：{{tabledata.explains}}</span>
        </div>
      </div>



      <div class="brief-cotainer" v-if="tabledata.type=='大题'">
        <div class="more-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">大题</span>
          <span class="oneselect-header-title">{{tabledata.bigQuestion}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="brief-item">
          <el-image
            v-for="(item,index) in tabledata.imgList"
            :key="index"
            class="brief-img-detail"
            :src="item"
            :preview-src-list="tabledata.imgList"
          >></el-image>
        </div>
        <div class="brief-file">
          <div class="brief-file-down" v-for="(item,index) in tabledata.fileList" :key="index">
            <span>文件{{index+1}}</span>
            <el-link target="_blank" :href="item.url" :underline="false" style="margin-left:15px">
              <el-button size="mini" type="warning">点击下载</el-button>
            </el-link>
          </div>
        </div>

        <div v-for="(item,i2) in tabledata.bankList" :key="i2">
          <div class="oneselect-cotainer" v-if="item.type=='单选题'||item.type=='单项选择题'">
            <div class="oneselect-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">单选</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
              <span class="score">({{item.fraction}}分)</span>
            </div>
            <div class="oneselect-body" v-for="(item2,i3) in item.options" :key="i3">
              <i
                :class="item2.keyTrue ? 'el-icon-success' : 'el-icon-error'"
                :style="{color:item2.keyTrue ? '#67c23a' : 'red'}"
              ></i>
              <span>{{String.fromCharCode(i3+65)}}</span>
              .{{item2.context}}
            </div>
         <div v-for="(item2,i3) in item.options" :key="'info-'+i3">
           <div class="oneselect-floote-answer" v-if="item2.keyTrue">
            答案：
            <span>{{String.fromCharCode(i3+65)}}</span>
            .{{item2.context}}
           </div>
        </div> 
            <div class="more-floote">
              <span class="answer">小题讲解：{{item.explains}}</span>
            </div>
          </div>

          <div class="more-cotainer" v-if="item.type=='多选题'||item.type=='多项选择题'">
            <div class="more-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">多选</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
              <span class="score">({{item.fraction}}分)</span>
            </div>
            <div class="more-body" v-for="(item2,i3) in item.options" :key="i3">
              <i
                :class="item2.keyTrue ? 'el-icon-success' : 'el-icon-error'"
                :style="{color:item2.keyTrue ? '#67c23a' : 'red'}"
              ></i>
              {{String.fromCharCode(i3+65)}}
              .{{item2.context}}
            </div>
            <div class="more-floote">
              <span class="more-floote-answer">答案：{{item.answer}}</span>
            </div>
            <div class="more-floote">
              <span class="answer">小题讲解：{{item.explains}}</span>
            </div>
          </div>

          <div class="oneselect-cotainer" v-if="item.type=='判断题'">
            <div class="oneselect-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">判断</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
              <span class="score">({{item.fraction}}分)</span>
            </div>
            <div class="judge-chose">
              <div class="judge-chose-item">
                <i
                  :class="item.answer=='true'  ? 'el-icon-success' : ''"
                  :style="{color:item.answer=='true' ? '#67c23a' : ''}"
                ></i>正确
              </div>
              <div class="judge-chose-item">
                <i
                  :class="item.answer!='true'  ? 'el-icon-success' : ''"
                  :style="{color:item.answer!='true'  ? '#67c23a' : ''}"
                ></i>错误
              </div>
            </div>
            <div class="judge-floote-answeritem">
              答案：
              <span>{{item.answer=='true' ? '正确' : '错误'}}</span>
            </div>
            <div class="judge-floote">
              小题讲解：
              <span class="answer">{{item.explains}}</span>
            </div>
          </div>

          <div class="bank-cotainer" v-if="item.type=='填空题'">
            <div class="bank-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">填空</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
            </div>
            <div class="bank-floote">
              <div class="bank-floote-answeritem">
                <div>
                  <span>答案：</span>
                </div>
                <div class="bank-floote-answeritem-body">
                  <span class="bank-floote-answer" v-for="(item2,i4) in item.options" :key="i4">
                    {{item2.answer}}
                    <span>({{item2.fraction}}分)</span>
                  </span>
                </div>
              </div>
              <div>
                <span class="bank-floote-explains">小题讲解：{{item.explains}}</span>
              </div>
            </div>
          </div>

          <div class="brief-cotainer" v-if="item.type=='简答题'">
            <div class="more-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">简答</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
              <span class="score">({{item.fraction}}分)</span>
            </div>
            <div class="brief-item">
              <el-image
                v-for="(item2,index2) in item.imgList"
                :key="index2"
                class="brief-img-detail"
                :src="item2"
                :preview-src-list="item.imgList"
              >></el-image>
            </div>
            <div class="brief-file">
              <div class="brief-file-down" v-for="(item2,index2) in item.fileList" :key="index2">
                <span>文件{{index2+1}}</span>
                <el-link
                  target="_blank"
                  :href="item2.url"
                  :underline="false"
                  style="margin-left:15px"
                >
                  <el-button size="mini" type="warning">点击下载</el-button>
                </el-link>
              </div>
            </div>
            <div class="brief-body">
              <span>答案：{{item.answer}}</span>
            </div>
            <div class="brief-floote">
              <span>小题讲解：{{item.explains}}</span>
            </div>
          </div>
        </div>
      </div>

      <div class="kong"></div>
    </div>
      </div>
    <div class="box" v-for="(tabledata,i) in container" :key="i">
      <div class="oneselect-cotainer" v-if="tabledata.type=='单选题'||tabledata.type=='单项选择题'">
        <div class="oneselect-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">单选</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="oneselect-body" v-for="(item,i2) in tabledata.options" :key="i2">
          <i
            :class="item.keyTrue ? 'el-icon-success' : 'el-icon-error'"
            :style="{color:item.keyTrue ? '#67c23a' : 'red'}"
          ></i>
          <span>{{String.fromCharCode(i2+65)}}</span>
          .{{item.context}}
        </div>
        <div v-for="(item2,i2) in tabledata.options" :key="'info-'+i2">
          <div class="oneselect-floote-answer" v-if="item2.keyTrue">
            答案：
            <span>{{String.fromCharCode(i2+65)}}</span>
            .{{item2.context}}
          </div>
        </div>
        <div class="oneselect-floote">
          小题讲解：
          <span class="answer">{{tabledata.explains}}</span>
        </div>
      </div>

      <div class="more-cotainer" v-if="tabledata.type=='多选题'||tabledata.type=='多项选择题'">
        <div class="more-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">多选</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="more-body" v-for="(item,i2) in tabledata.options" :key="i2">
          <i
            :class="item.keyTrue ? 'el-icon-success' : 'el-icon-error'"
            :style="{color:item.keyTrue ? '#67c23a' : 'red'}"
          ></i>
          {{String.fromCharCode(i2+65)}}
          .{{item.context}}
        </div>
        <div class="more-floote">
          <span class="more-floote-answer">答案：{{tabledata.answer}}</span>
        </div>
        <div class="more-floote">
          <span class="answer">小题讲解：{{tabledata.explains}}</span>
        </div>
      </div>

      <div class="bank-cotainer" v-if="tabledata.type=='填空题'">
        <div class="bank-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">填空</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
        </div>
        <div class="bank-floote">
          <div class="bank-floote-answeritem">
            <div>
              <span>答案：</span>
            </div>
            <div class="bank-floote-answeritem-body">
              <span class="bank-floote-answer" v-for="(item,i) in tabledata.options" :key="i">
                {{item.answer}}
                <span>({{item.fraction}}分)</span>
              </span>
            </div>
          </div>
          <div>
            <span class="bank-floote-explains">小题讲解：{{tabledata.explains}}</span>
          </div>
        </div>
      </div>

      <div class="oneselect-cotainer" v-if="tabledata.type=='判断题'">
        <div class="oneselect-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">判断</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="judge-chose">
          <div class="judge-chose-item">
            <i
              :class="tabledata.answer=='true'  ? 'el-icon-success' : ''"
              :style="{color:tabledata.answer=='true' ? '#67c23a' : ''}"
            ></i>正确
          </div>
          <div class="judge-chose-item">
            <i
              :class="tabledata.answer!='true'  ? 'el-icon-success' : ''"
              :style="{color:tabledata.answer!='true'  ? '#67c23a' : ''}"
            ></i>错误
          </div>
        </div>
        <div class="judge-floote-answeritem">
          答案：
          <span>{{tabledata.answer=='true' ? '正确' : '错误'}}</span>
        </div>
        <div class="judge-floote">
          小题讲解：
          <span class="answer">{{tabledata.explains}}</span>
        </div>
      </div>

      <div class="brief-cotainer" v-if="tabledata.type=='简答题'">
        <div class="more-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">简答</span>
          <span class="oneselect-header-title">{{tabledata.smallTopic}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="brief-item">
          <el-image
            v-for="(item,index) in tabledata.imgList"
            :key="index"
            class="brief-img-detail"
            :src="item"
            :preview-src-list="tabledata.imgList"
          >></el-image>
        </div>
        <div class="brief-file">
          <div class="brief-file-down" v-for="(item,index) in tabledata.fileList" :key="index">
            <span>文件{{index+1}}</span>
            <el-link target="_blank" :href="item.url" :underline="false" style="margin-left:15px">
              <el-button size="mini" type="warning">点击下载</el-button>
            </el-link>
          </div>
        </div>
        <div class="brief-body">
          <span>答案：{{tabledata.answer}}</span>
        </div>
        <div class="brief-floote">
          <span>小题讲解：{{tabledata.explains}}</span>
        </div>
      </div>



      <div class="brief-cotainer" v-if="tabledata.type=='大题'">
        <div class="more-header">
          <span style="font-size:18px">{{i+1}}.</span>
          <span class="type">大题</span>
          <span class="oneselect-header-title">{{tabledata.bigQuestion}}</span>
          <span class="score">({{tabledata.fraction}}分)</span>
        </div>
        <div class="brief-item">
          <el-image
            v-for="(item,index) in tabledata.imgList"
            :key="index"
            class="brief-img-detail"
            :src="item"
            :preview-src-list="tabledata.imgList"
          >></el-image>
        </div>
        <div class="brief-file">
          <div class="brief-file-down" v-for="(item,index) in tabledata.fileList" :key="index">
            <span>文件{{index+1}}</span>
            <el-link target="_blank" :href="item.url" :underline="false" style="margin-left:15px">
              <el-button size="mini" type="warning">点击下载</el-button>
            </el-link>
          </div>
        </div>

        <div v-for="(item,i2) in tabledata.bankList" :key="i2">
          <div class="oneselect-cotainer" v-if="item.type=='单选题'||item.type=='单项选择题'">
            <div class="oneselect-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">单选</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
              <span class="score">({{item.fraction}}分)</span>
            </div>
            <div class="oneselect-body" v-for="(item2,i3) in item.options" :key="i3">
              <i
                :class="item2.keyTrue ? 'el-icon-success' : 'el-icon-error'"
                :style="{color:item2.keyTrue ? '#67c23a' : 'red'}"
              ></i>
              <span>{{String.fromCharCode(i3+65)}}</span>
              .{{item2.context}}
            </div>
         <div v-for="(item2,i3) in item.options" :key="'info-'+i3">
           <div class="oneselect-floote-answer" v-if="item2.keyTrue">
            答案：
            <span>{{String.fromCharCode(i3+65)}}</span>
            .{{item2.context}}
           </div>
        </div> 
            <div class="more-floote">
              <span class="answer">小题讲解：{{item.explains}}</span>
            </div>
          </div>

          <div class="more-cotainer" v-if="item.type=='多选题'||item.type=='多项选择题'">
            <div class="more-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">多选</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
              <span class="score">({{item.fraction}}分)</span>
            </div>
            <div class="more-body" v-for="(item2,i3) in item.options" :key="i3">
              <i
                :class="item2.keyTrue ? 'el-icon-success' : 'el-icon-error'"
                :style="{color:item2.keyTrue ? '#67c23a' : 'red'}"
              ></i>
              {{String.fromCharCode(i3+65)}}
              .{{item2.context}}
            </div>
            <div class="more-floote">
              <span class="more-floote-answer">答案：{{item.answer}}</span>
            </div>
            <div class="more-floote">
              <span class="answer">小题讲解：{{item.explains}}</span>
            </div>
          </div>

          <div class="oneselect-cotainer" v-if="item.type=='判断题'">
            <div class="oneselect-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">判断</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
              <span class="score">({{item.fraction}}分)</span>
            </div>
            <div class="judge-chose">
              <div class="judge-chose-item">
                <i
                  :class="item.answer=='true'  ? 'el-icon-success' : ''"
                  :style="{color:item.answer=='true' ? '#67c23a' : ''}"
                ></i>正确
              </div>
              <div class="judge-chose-item">
                <i
                  :class="item.answer!='true'  ? 'el-icon-success' : ''"
                  :style="{color:item.answer!='true'  ? '#67c23a' : ''}"
                ></i>错误
              </div>
            </div>
            <div class="judge-floote-answeritem">
              答案：
              <span>{{item.answer=='true' ? '正确' : '错误'}}</span>
            </div>
            <div class="judge-floote">
              小题讲解：
              <span class="answer">{{item.explains}}</span>
            </div>
          </div>

          <div class="bank-cotainer" v-if="item.type=='填空题'">
            <div class="bank-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">填空</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
            </div>
            <div class="bank-floote">
              <div class="bank-floote-answeritem">
                <div>
                  <span>答案：</span>
                </div>
                <div class="bank-floote-answeritem-body">
                  <span class="bank-floote-answer" v-for="(item2,i4) in item.options" :key="i4">
                    {{item2.answer}}
                    <span>({{item2.fraction}}分)</span>
                  </span>
                </div>
              </div>
              <div>
                <span class="bank-floote-explains">小题讲解：{{item.explains}}</span>
              </div>
            </div>
          </div>

          <div class="brief-cotainer" v-if="item.type=='简答题'">
            <div class="more-header">
              <span style="font-size:18px">（{{i2+1}}）</span>
              <span class="type">简答</span>
              <span class="oneselect-header-title">{{item.smallTopic}}</span>
              <span class="score">({{item.fraction}}分)</span>
            </div>
            <div class="brief-item">
              <el-image
                v-for="(item2,index2) in item.imgList"
                :key="index2"
                class="brief-img-detail"
                :src="item2"
                :preview-src-list="item.imgList"
              >></el-image>
            </div>
            <div class="brief-file">
              <div class="brief-file-down" v-for="(item2,index2) in item.fileList" :key="index2">
                <span>文件{{index2+1}}</span>
                <el-link
                  target="_blank"
                  :href="item2.url"
                  :underline="false"
                  style="margin-left:15px"
                >
                  <el-button size="mini" type="warning">点击下载</el-button>
                </el-link>
              </div>
            </div>
            <div class="brief-body">
              <span>答案：{{item.answer}}</span>
            </div>
            <div class="brief-floote">
              <span>小题讲解：{{item.explains}}</span>
            </div>
          </div>
        </div>
      </div>

      <div class="kong"></div>
    </div>-->
  </div>
</template>

<script>
import { search } from "@/api/topic/showDetail";
  import {
    getautoPaperdetail
  } from "@/api/paper/Automatic";
import { getPaper } from "@/api/paper/paper";
export default {
  name: "showpaper",
  props: ["row"],
  data() {
    return {
      // 遮罩层
      paperdata: [],
      loading: true,
      exhead: "http://10.168.100.154" + process.env.VUE_APP_BASE_API,
      container: [],
      showimgList: [],
      imgurl: "",
      showfileList: [],
      beanName: "",
      pointptions: [
        {
          label: "对",
          value: true,
        },
        {
          label: "错",
          value: false,
        },
      ],
      options: [
        {
          answer: "sdsada",
          fraction: 2,
        },
        {
          answer: "sdsada",
          fraction: 2,
        },
        {
          answer: "sdsada",
          fraction: 2,
        },
      ],
      tableData: [
        {
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-04",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1517 弄",
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1519 弄",
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1516 弄",
        },
      ],
    };
  },
  created() {
    // this.getaotopaperdetail(this.row);
    this.paperdata=this.row
    console.log(this.row)
    console.log("试卷111",this.paperdata)
    this.loading = false;
  },
  methods: {
    // 获取试卷详情
    getaotopaperdetail(data){
         getautoPaperdetail(data.id).then((response) => {
         this.paperdata = response;
          console.log("试卷111",response)
        });
    },

    //自定义索引
    indexMethod(index) {
      return "第" + (index + 1) + "题";
    },
    getpaperdetail() {
      const id = this.row.id;
      getPaper(id).then((response) => {
        this.paperdata = response.data;
      });
      setTimeout(() => {
        this.gosearch();
      }, 2000);
    },
    gosearch() {
      for (let t = 0; t < this.paperdata.structureList.length; t++) {
        this.paperdata.structureList[t].container =
          this.paperdata.structureList[t].bankList;
        if (this.paperdata.structureList[t].container != null) {
          for (
            let j = 0;
            j < this.paperdata.structureList[t].container.length;
            j++
          ) {
            //处理简答题和大题的图片
            if (
              this.paperdata.structureList[t].container[j].beanName ==
                "shortAnswerServiceImpl" ||
              this.paperdata.structureList[t].container[j].beanName ==
                "bigQuestionServiceImpl"
            ) {
              this.paperdata.structureList[t].container[j].imgList = [];
              this.paperdata.structureList[t].container[j].fileList = [];
              let imgtemplatedata = [];
              let filetemplatedata = [];
              if (this.paperdata.structureList[t].container[j].fileUrl) {
                filetemplatedata =
                  this.paperdata.structureList[t].container[j].fileUrl.split(
                    ","
                  );
                for (let k = 0; k <= filetemplatedata.length - 2; k++) {
                  const data = {
                    url: this.exhead + filetemplatedata[k],
                    name: filetemplatedata[k],
                  };
                  this.paperdata.structureList[t].container[j].fileList[k] =
                    data;
                }
              }

              if (this.paperdata.structureList[t].container[j].imgUrl) {
                imgtemplatedata =
                  this.paperdata.structureList[t].container[j].imgUrl.split(
                    ","
                  );
                for (let k = 0; k <= imgtemplatedata.length - 2; k++) {
                  this.paperdata.structureList[t].container[j].imgList[k] =
                    this.exhead + imgtemplatedata[k];
                }
              }
            }

            //大题内简答题的图片和文件处理
            if (this.paperdata.structureList[t].container[j].bankList != null) {
              for (
                let h = 0;
                h <
                this.paperdata.structureList[t].container[j].bankList.length;
                h++
              ) {
                if (
                  this.paperdata.structureList[t].container[j].bankList[h]
                    .beanName == "shortAnswerServiceImpl"
                ) {
                  this.paperdata.structureList[t].container[j].bankList[
                    h
                  ].imgList = [];
                  this.paperdata.structureList[t].container[j].bankList[
                    h
                  ].fileList = [];
                  let imgtemplatedata = [];
                  let filetemplatedata = [];

                  if (
                    this.paperdata.structureList[t].container[j].bankList[h]
                      .fileUrl
                  ) {
                    filetemplatedata =
                      this.paperdata.structureList[t].container[j].bankList[
                        h
                      ].fileUrl.split(",");
                    for (let k = 0; k <= filetemplatedata.length - 2; k++) {
                      const data = {
                        url: this.exhead + filetemplatedata[k],
                        name: filetemplatedata[k],
                      };
                      this.paperdata.structureList[t].container[j].bankList[
                        h
                      ].fileList[k] = data;
                    }
                  }
                  if (
                    this.paperdata.structureList[t].container[j].bankList[h]
                      .imgUrl
                  ) {
                    imgtemplatedata =
                      this.paperdata.structureList[t].container[j].bankList[
                        h
                      ].imgUrl.split(",");
                    for (let k = 0; k <= imgtemplatedata.length - 2; k++) {
                      this.paperdata.structureList[t].container[j].bankList[
                        h
                      ].imgList[k] = this.exhead + imgtemplatedata[k];
                    }
                  }
                }
              }
            }
          }
        }
      }
      //  this.container = this.row.bankList

      this.loading = false;
    },
    download(data) {
      //  let url=data.filename;
      // this.download(data);
      //  this.download(this.showfileList[data].url)
    },
  },
};
</script>

<style>
.kong {
  width: 100%;
  height: 5px;
}
.topic {
  font-size: 20px;
  font-weight: 600;
  width: 100%;
  border-bottom: 2px solid #dcdfe6;
}
.totalhead {
  display: flex;

  justify-content: center;
  width: 50%;
  margin-left: 50%;
  transform: translateX(-50%);
  font-size: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
}
.rule {
  font-size: 18px;
  font-weight: 500;
  color: #909399;
}
.all {
  width: 100%;
  height: 100%;
  /* background-color: #E4E7ED; */
}
.box {
  padding-top: 20px;
  margin-left: 10px;
  margin-right: 10px;
}
.allhead {
  text-align: center;
  color: #303133;
  font-size: 40px;
  font-weight: 600;
}
.oneselect-header-title {
  font-size: 18px;
  color: #303133;
}
.type {
  font-size: 16px;
  color: #67c23a;
  border: 1px solid #67c23a;
  margin-right: 10px;
}
.body-chose1 {
  color: #67c23a;
}
.body-chose2 {
  color: #f56c6c;
}
.score {
  color: #909399;
  margin-left: 5px;
}
.answer {
  font-size: 18px;
  color: #67c23a;
}
.oneselect-cotainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 15px;
  margin-bottom: 20px;
}
.oneselect-header {
  font-size: 16px;
  color: #303133;
}
.oneselect-body {
  margin-top: 10px;
  margin-left: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  border-bottom: 1px dashed #dcdfe6;
  color: #303133;
}
.oneselect-floote {
  margin-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  color: #67c23a;
  border-bottom: 1px dashed #dcdfe6;
}
.oneselect-floote-answer {
  margin-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  color: #303133;
  border-bottom: 1px dashed #dcdfe6;
}
.more-cotainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 40px;
  margin-bottom: 40px;
}
.more-header {
  font-size: 16px;
  color: #303133;
}
.more-body {
  margin-top: 10px;
  margin-left: 10px;
  font-size: 18px;
  color: #303133;
  padding-top: 10px;
  padding-bottom: 10px;
  border-bottom: 1px dashed #dcdfe6;
}
.more-floote {
  margin-top: 10px;
  font-size: 18px;
  padding-bottom: 10px;
  color: #67c23a;
  border-bottom: 1px dashed #dcdfe6;
}
.more-floote-answer {
  margin-top: 10px;
  font-size: 18px;
  padding-bottom: 10px;
  border-bottom: 1px dashed #dcdfe6;
  color: #303133;
}
.bank-cotainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 40px;
  margin-bottom: 40px;
}
.bank-header {
  font-size: 16px;
  color: #303133;
}
.bank-body {
  margin-top: 10px;
  margin-left: 10px;
  font-size: 18px;
  color: #303133;
  border-bottom: 1px dashed #dcdfe6;
}
.bank-floote {
  margin-top: 20px;
  color: #303133;
  border-bottom: 1px dashed #dcdfe6;
}
.bank-floote-answer {
  margin-left: 10px;
  color: #303133;
}
.bank-floote-answeritem {
  display: flex;
  font-size: 18px;
  color: #303133;
  padding-bottom: 10px;
  border-bottom: 1px dashed #dcdfe6;
}
.bank-floote-answeritem-body {
  display: flex;
  flex-direction: column;
  margin-left: 5px;
}
.bank-floote-explains {
  display: block;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  color: #67c23a;
}
.judge-chose {
  margin-top: 15px;
  padding-bottom: 10px;
  display: flex;
  border-bottom: 1px dashed #dcdfe6;
  color: #303133;
}
.judge-chose-item {
  margin-left: 20px;
  font-size: 18px;
  color: #303133;
}
.brief-cotainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 40px;
  margin-bottom: 40px;
}
.judge-floote {
  margin-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  color: #67c23a;
  border-bottom: 1px dashed #dcdfe6;
}
.judge-floote-answeritem {
  margin-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  color: #303133;
  border-bottom: 1px dashed #dcdfe6;
}
.brief-header {
  font-size: 16px;
  color: #303133;
}
.brief-body {
  margin-top: 20px;
  margin-left: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  color: #303133;
  border-bottom: 1px dashed #dcdfe6;
}
.brief-floote {
  margin-top: 20px;
  padding-bottom: 20px;
  margin-left: 10px;
  font-size: 18px;
  color: #67c23a;
  border-bottom: 1px dashed #dcdfe6;
}
.brief-item {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}
.brief-img-detail {
  width: 200px;
  height: 200px;
  margin-top: 20px;
  margin-bottom: 20px;
  border: 1px solid #e4e7ed;
}
.brief-file {
  display: flex;
  flex-direction: column;
  margin-left: 20px;
  justify-content: center;
  color: #909399;
}
.brief-file-down {
  font-size: 18px;
  margin-top: 20px;
}
.paperitemhead {
  color: #303133;
  font-size: 20px;
  font-weight: 500;
}
.table {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #606266;
}
.table-top {
  width: 80px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  font-weight: 550;
  border-top: 1px solid #dcdfe6;
  border-left: 1px solid #dcdfe6;
  border-bottom: 1px solid #dcdfe6;
}
.table-top-end {
  width: 80px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  font-weight: 550;
  border: 1px solid #dcdfe6;
}
.table-bottom {
  width: 80px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  border-left: 1px solid #dcdfe6;
  border-bottom: 1px solid #dcdfe6;
}
.table-bottom-end {
  width: 80px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  border-left: 1px solid #dcdfe6;
  border-bottom: 1px solid #dcdfe6;
  border-right: 1px solid #dcdfe6;
}
</style>